﻿package idv.etrex.display
{
	import flash.display.Graphics;
	
	/**
	 * 用svg來儲存graphics指令，搭配GraphicsBat使用。
	 * @includeExample Demo.txt
	 */
	public class SVG implements IGraphics
	{

		/**
		 * 裝SVG的容器
		 */
		public var xml:XML;
		
		private var width : Number;
		private var height : Number;
		private var lineColor :uint;
		private var fillColor :uint;
		private var strokeWidth:Number;
		private var lastX : Number;
		private var lastY : Number;
		

		/**
		 * 建立SVG物件時，必須指定高度和寬度
		 * @param	width 寬度
		 * @param	height 高度
		 */
		public function SVG(width:Number, height:Number)
		{
			this.width = width;
			this.height = height;
			clearXML();
		}
		
		/**
		 * clear XML
		 */
		public function clearXML():void {
			//<svg width="12cm" height="4cm" viewBox="0 0 1200 400" xmlns="http://www.w3.org/2000/svg" version="1.1"/> ;
			this.xml = <svg/>;
			this.xml.@width = this.width;
			this.xml.@height = this.height;
			this.xml.@viewBox = "0 0 " + this.width + " " + this.height;
			this.xml.@xmlns = "http://www.w3.org/2000/svg";
			this.xml.@version = "1.1";
		}
		
		/**
		 * 輸出所儲存的xml字串
		 * output xml string
		 */
		public function toString():String {
			return xml.toXMLString();
		}
		
		// graphics function 
		/**
		 * graphics指令
		 */
		public function beginFill(color:uint, alpha:Number = 1.0):void{
			fillColor = color;
		}

		/**
		 * graphics指令
		 */
		public function clear():void{
			clearXML();
		}
		
		/**
		 * graphics指令
		 */
		public function drawCircle(x:Number, y:Number, radius:Number):void {
			//<circle cx="600" cy="200" r="100" fill="red" stroke="blue" stroke-width="10"  />
			var xml:XML = new XML('<circle cx="' + x + '" cy="' + y + '" r="' + radius + '" fill="' + uintToCSS2Color(fillColor) + '" stroke="' + uintToCSS2Color(lineColor) + '" stroke-width="' + strokeWidth + '"/>');
			this.xml.appendChild(xml);
		}
		
		/**
		 * graphics指令
		 */
		public function drawEllipse(x:Number, y:Number, width:Number, height:Number):void{
			var xml:XML = new XML('<ellipse cx="' + x + '" cy="' + y + '" rx="' + width +  '" ry="' + height + '" fill="' + uintToCSS2Color(fillColor) + '" stroke="' + uintToCSS2Color(lineColor) + '" stroke-width="' + strokeWidth + '"/>');
			this.xml.appendChild(xml);
		}
		
		/**
		 * graphics指令
		 */
		public function drawRect(x:Number, y:Number, width:Number, height:Number):void {
			//<rect x="1" y="1" width="1198" height="398" fill="none" stroke="blue" stroke-width="2" />
			var xml:XML = new XML('<rect x="' + x + '" y="' + y + '" width="' + width + '" height="' + height + '" fill="' + uintToCSS2Color(fillColor) + '" stroke="' + uintToCSS2Color(lineColor) + '" stroke-width="' + strokeWidth + '"/>');
			this.xml.appendChild(xml);
		}
		
		/**
		 * graphics指令
		 */
		public function drawRoundRect(x:Number, y:Number, width:Number, height:Number, ellipseWidth:Number, ellipseHeight:Number = NaN):void{
			var xml:XML = new XML('<rect x="' + x + '" y="' + y + '" width="' + width + '" height="' + height +  '" rx="' + ellipseWidth + '" fill="' + uintToCSS2Color(fillColor) + '" stroke="' + uintToCSS2Color(lineColor) + '" stroke-width="' + strokeWidth + '"/>');
			this.xml.appendChild(xml);
		}
		
		/**
		 * graphics指令
		 */
		public function endFill():void {
			
		}
		
		/**
		 * graphics指令
		 */
		public function lineStyle(thickness:Number = NaN, color:uint = 0, alpha:Number = 1.0, pixelHinting:Boolean = false, scaleMode:String = "normal", caps:String = null, joints:String = null, miterLimit:Number = 3):void{
			lineColor = color;
			strokeWidth = thickness;
		}
		
		/**
		 * graphics指令
		 */
		public function moveTo(x:Number, y:Number):void {
			lastX = x;
			lastY = y;
		}
		
		/**
		 * graphics指令
		 */
		public function lineTo(x:Number, y:Number):void {
			var xml:XML = new XML('<line x1="' + lastX + '" y1="' + lastY + '" x2="' + x + '" y2="' + y + '" stroke-width="' + strokeWidth + '" stroke="' + uintToCSS2Color(lineColor) + '" />');
			this.xml.appendChild(xml);
			lastX = x;
			lastY = y;
		}
		
		//color parseing
		private function uintToCSS2Color(color:uint):String {
			var R:uint = color / 0x10000;
			var G:uint = (color / 0x100) % 0x100;
			var B:uint = color % 0x100;
			return "rgb(" + R + "," + G + "," + B + ")";
		}
	}
}